<template>
    <el-tooltip effect="dark" :content="appData.name" placement="top">
        <el-tag type="info">{{ appData.id }}</el-tag>
    </el-tooltip>
</template>

<script>
    export default {
        props: ['appid'],
        data () {
            return {};
        },
        watch: {
        },
        computed: {
            apps() {
                return this.$store.state.app.all;
            },
            appData() {
                let data = {};
                for (let i in this.apps) {
                    if (this.apps[i].id === this.appid) {
                        data = this.apps[i];
                        break;
                    }
                }
                return data;
            },
        },
        methods: {
            getApps() {
                if (!this.apps.length) this.$store.dispatch('app/All');
            }
        },
        created() {
            this.getApps();
        }
    }
</script>

<style scoped>

</style>